/* components */
import { 
  SettingGPTViewDialog,
  SettingGPTViewContentTitle,
  SettingGPTViewContentSubTitle,
  SettingGPTViewCheckbox,
  SettingGPTViewCheckboxGroup
} from "@src/modules/setting/gpt/components"
import SettingGPTEditViewModuleAdd from "@src/modules/setting/gpt/views/edit/module-add"
import SettingGPTEditViewModuleMixin from "@src/modules/setting/gpt/views/edit/module-mixin"
import WikiTreeDialog from '@gpt/components/wiki-tree-dialog'
/* enum */
import ComponentNameEnum from '@model/enum/ComponentNameEnum'
/* model */
import { 
  SettingGPTRobotInsideModuleCustomer, 
  SettingGPTRobotInsideModuleProduct, 
  SettingGPTRobotInsideModuleTask 
} from "@src/modules/setting/gpt/model"
/* hooks */
import { 
  useFetchSettingGPTRobotAppWikiTypeInsert, 
  useFetchSettingGPTRobotAppWikiTypeQuery 
} from "@gpt/hooks/robot"
/* vue */
import { defineComponent } from 'vue'
/* util */
import { isEmpty } from "@src/util/type"
import { message } from "@src/util/message"
/* types */
import { SettingGPTRobotModuleType } from "@gpt/types"

type SettingGPTViewDialogComponentType = InstanceType<typeof SettingGPTViewDialog>
type WikiTreeDialogComponentType = InstanceType<typeof WikiTreeDialog>

enum SettingGPTEditViewModuleInsideEventEnum {
  Input = 'input'
}

export default defineComponent({
  name: ComponentNameEnum.SettingGPTEditViewModuleInside,
  mixins: [SettingGPTEditViewModuleMixin],
  props: {
    robotAppId: {
      type: [Number, String]
    }
  },
  setup() {
    
    const { 
      fetchRobotAppWikiTypeInsert
    } = useFetchSettingGPTRobotAppWikiTypeInsert()
    const { 
      fetchRobotAppWikiTypeQuery,
      wikiTypeList
    } = useFetchSettingGPTRobotAppWikiTypeQuery()

    return {
      wikiTypeList,
      fetchRobotAppWikiTypeInsert,
      fetchRobotAppWikiTypeQuery
    }
    
  },
  computed: {
    title(): string {
      return '数据来源-内部模块'
    },
    subTitle(): string {
      return '勾选后，AI机器人会获取对应模块的相关数据进行查询和回答。'
    },
    showModuleList(): SettingGPTRobotModuleType[] {
      
      const modules = this.modules.slice()
      
      return [
        ...modules,
        SettingGPTRobotInsideModuleTask,
        SettingGPTRobotInsideModuleCustomer,
        SettingGPTRobotInsideModuleProduct
      ]
    },
    wikiTreeDialog(): WikiTreeDialogComponentType {
      return this.$refs.WikiTreeDialog as WikiTreeDialogComponentType;
    }
  },
  methods: {
    onAddModuleHandler() {
      message.warning('暂未开放，敬请期待')
    },
    onSettingWikiClickHandler() {
      this.openWikiTreeDialog()
    },
    openWikiTreeDialog() {
      this.wikiTreeDialog.open()
      this.onFetchRobotAppWikiTypeQueryHandler()
    },
    async onWikiTreeDialogConfirmHandler(value: string[]) {
      
      if (isEmpty(value)) {
        message.warning('请选择知识库范围')
        return
      }
      
      const params = {
        robotAppId: this.robotAppId as string,
        wikiTypeIdList: value
      }
      
      const isSuccess = await this.fetchRobotAppWikiTypeInsert(params)
      
      if (isSuccess) {
        message.success('保存成功')
        this.wikiTreeDialog.close()
      }
      
    },
    async onFetchRobotAppWikiTypeQueryHandler() {
      
      const params = {
        robotAppId: this.robotAppId as string
      }
      
      await this.fetchRobotAppWikiTypeQuery(params)
      
      const wikiTypeList = this.wikiTypeList
      const wikiTypeListValue = wikiTypeList.map(item => item.wikiTypeId)
      
      this.wikiTreeDialog.setValue(wikiTypeListValue)
    }
  },
  render() {
    return (
      <div class={ComponentNameEnum.SettingGPTEditViewModuleInside}>
        
        { this.renderTitle() }
        
        { this.renderSubTitle() }
        
        { this.renderCheckboxGroup() }
        
        <SettingGPTViewDialog
          title="添加更多"
          ref="SettingGPTViewDialog"
          onConfirm={this.onAddMoreConfirmHandler}
        >
          <SettingGPTEditViewModuleAdd
            ref="SettingGPTEditViewModuleAdd"
            title="内部模块"
            modules={this.allowAddModuleList}
            onInput={this.onAddMoreSelectValueListChangeHandler}
          >
          </SettingGPTEditViewModuleAdd>
        </SettingGPTViewDialog>
        
        <WikiTreeDialog
          ref="WikiTreeDialog"
          onConfirm={this.onWikiTreeDialogConfirmHandler}
        >
        </WikiTreeDialog>
        
      </div>
    )
  }
})